import React, { Component } from 'react';
import  './index.scss'
class Index extends Component {
  state = {
    styleObject: {

    }
  }
  render() {
    const { styleObject } = this.state
    return (
      <div className="header" style={ styleObject }>
        我是头部
      </div>
    );
  }
  componentDidMount() {
    document.addEventListener('scroll', () => {
      const scollTop = document.documentElement.scrollTop
      console.log(scollTop);
      if( scollTop > 50) {
        this.setState({
          styleObject: {
            position: 'fixed',
            top: 0
          }
        })
        console.log(1);
      } else {
        this.setState({
          styleObject: {
            position: 'static',
          }
        })
      }
    })
  }
}

export default Index;
